import React from 'react'
//导入 react-redux 的 hooks
// import { useSelector, useDispatch } from 'react-redux'
//导入 action creator
import {add, sub} from '@app/slice';
//导入自定义的 selector 和 dispatch
import { useAppDispatch, useAppSelector } from '@app/hooks';

export default function ReduxCom() {
  //获取 redux 中的状态
  const state = useAppSelector(state => state.value);
  const dispatch = useAppDispatch();
  return (
    <div>
      <h2>{state}</h2>
      <button onClick={() => {
        //新增
        dispatch(add(10))
      }}>++</button>
      <button onClick={() => {
        //新增
        dispatch(sub(10))
      }}>--</button>
    </div>
  )
}
